<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>订单分配到门店_{$webname}</title>
<!--公共样式开始-->
<link rel="stylesheet" type="text/css" href="{$NOW_THEME_URL}/Assets/css/reset.css">
<link rel="stylesheet" type="text/css" href="{$NOW_THEME_URL}/Assets/css/common.css">
<!--公共样式结束-->
<!--私有样式开始-->
<link rel="stylesheet" type="text/css" href="{$NOW_THEME_URL}/Assets/css/page_order.css">
<!--私有样式结束-->
<!--FontAwesome开始-->
<link rel="stylesheet" type="text/css" href="{$NOW_THEME_URL}/Assets/plugins/FontAwesome/css/font-awesome.min.css">
<!--FontAwesome结束-->
<!--核心JS开始-->
<script src="{$NOW_THEME_URL}/Assets/js/jquery.min.js"></script>
<script src="__PUBLIC__/Js/jquery-migrate-1.2.1.min.js"></script> 
<script type="text/javascript" src="__PUBLIC__/Plugins/artDialog/jquery.artdialog.js?skin=bootstrap"></script>
<script type="text/javascript" src="__PUBLIC__/Plugins/artDialog/plugins/iframeTools.js"></script>
<style type="text/css">
#relationOutlet{
	line-height:40px;
	text-align:center;
}
#relationOutlet div span{
	font-size:14px;
	font-weight:bold;
}
#relationOutlet input , #relationOutlet option{
	width:100px;
	height:25px;
	line-height:25px;
}
#relationOutlet em{
	font-style:normal;
	font-size:16px;
}
#relationOutlet .fenp_b{
	width:200px;
	height:30px;
	line-height:30px;
	border:none;
	background:#21AB38;
	color:#FFF;
	text-align:center;
	font-size:16px;
	border-radius:3px;
	margin-top:20px;
}
select {
	width:90%;
	padding:5px;
}
</style>
<!--核心JS结束-->
<script type="text/javascript">
	$(function(){
		$('#goBack').on('click',function(){
			window.history.back();
		});
		
		/*右侧导航点击事件*/
		$('.hb_right').click(function(){
			$(".wrapper").toggleClass("a");
			$(".nav_box").toggleClass("b");
		});
		
		/*右侧导航二级*/
		$('.erji').click(function(){
			$(this).find("ul").toggleClass("c");
		});
	});
</script>
</head>
<body>
<!-- 头部开始-->
<include file="Public:header"/>
<!-- 头部结束-->
<!--主体开始-->
<div id="pageHome">
	<!--主体盒子开始-->
    <div id="wrapper" class="wrapper radius_5 bg_white">
    	
    	
    	<form id="relationOutlet" >
	
			<div style="text-align:left;"><span>订单地址:</span>{$row.address}</div>
			<input type="hidden" name="id" value="{$row.id}">
			<input type="hidden" name="outname" id="outname" value="">
			<div id="areaBox" style="display:inline"></div>
			<select name="outletid" id="outletid">
			<option value="">请选择分配的门店</option>
			</select>
			<input class="fenp_b" type="button" id="confirm" value="确认分配" />
		</form>
    	
    	
    <!--主体盒子结束 -->
    <!--导航盒子开始-->
    <include file="Public:menu" />
    <!--导航盒子结束-->
</div>
<script>
function submitForm(){
	var data = $('#relationOutlet').serialize();
	
	var outlet = $('#outletid').val();
	if(outlet==''){
		art.dialog.alert("必须选择门店");
		return false;
	}
	
	$.post("{:U('Order/order_allot')}",data,function(data){
		alert(data.info);
		var url = "{:U('Order/order_index')}";
		window.location.href=url;
	});
}

function changeOutlet(){
	
	var text = $('#outletid').find("option:selected").text();
	$('#outname').val(text);
}

function mapOutletArea(area){
	
	$.post("{:U('Public/mapOutlet')}",{'area':area,'type':'area'},function(data){
		dealOutlet(data);
	});
}

function dealOutlet(data){
	var html  = "<option value=''>请选择门店</option>";
	var option= "";
	if(data.status == 1){
		var out = data.data;
		$.each(out,function(i){
			option += "<option value='"+out[i].outletid+"'>"+out[i].title+"</option>";
		});			
	}else{
		art.dialog.alert(data.info);
	}
	$('#outletid').html(html+option);
}
 
//地址开始
var linkage_json = {$json|json_encode} ;
$(function(){
	
	$('#area4').live("change",function(){
		var area = $(this).val();
		mapOutletArea(area);
	});
	
	$('#confirm').on("click",function(){
		submitForm();
	});
	
	$('#outletid').live("change",function(){
		changeOutlet();
	});
	
	//初始值处理
	var did = '112';
	if(did!=''){
		$('#areaBox').html(dealInitialarea(did,'',3));
	}else{
		$('#areaBox').html(showLinkagearea(39,2,0));
	}
	$('select[name="area"]').live('change',function(){
		var nowLevel = parseInt($(this).attr('level'));
		var nextLevel = nowLevel+1;
		//清除自此以后的select
		$('select[name="area"]').each(function(index, element) {
			if(parseInt($(this).attr('level'))>nowLevel){
				$(this).remove();
			}
		});
		//$('#ssxadd').val($('select[name="area"]').find("option:selected").text());
		$('input[name="area'+nowLevel+'"]').val($(this).val());
		
		//显示下一个select
		$('#areaBox').append(showLinkagearea($(this).val(),nextLevel,0));
	});
	
	//处理初始值
	function dealInitialarea(lid,result,level){
		if(lid){
			$.each(linkage_json , function(i, n){
				if(lid==i){
					result = dealInitialarea(n[1],result,(parseInt(level)-1))+''+showLinkagearea(n[1],level,i);
					return false;
				}
			});
		}
		
		return result;
	}
	
	//响应select改变事件
	function showLinkagearea(pid,level,nid){
		var html = ''; //最终输出的HTML
		var have = false; //是否有子词典
		html += '<select name="area" id="area'+level+'" level="'+level+'">';
		html += '<option value="0">请选择</option>';
		$.each(linkage_json , function(i, n){
			if(pid==n[1]){
				if(nid==i){
					html += '<option value="'+i+'" selected>'+n[0]+'</option>';
				}else{
					html += '<option value="'+i+'">'+n[0]+'</option>';
				}
				have = true;
			}
		});
		html += '</select>';
		html += '<input type="hidden" name="area'+level+'" />';
		
		//没有子词典则此次输出为空
		if(!have){
			html = '';
		}
		return html;
	}
	
	$('#area3').trigger("change");
});
</script>

<!--主体结束-->
</body>
</html>